<template>
  <div>
    <el-dialog
      :visible.sync="dialogConf.show"
      :title="dialogConf.title != null ? dialogConf.title : dialogConfBak.title"
      :width="dialogConf.width != null ? dialogConf.width : dialogConfBak.width"
      :fullscreen="
        dialogConf.fullscreen != null
          ? dialogConf.fullscreen
          : dialogConfBak.fullscreen
      "
      :top="dialogConf.top != null ? dialogConf.top : dialogConfBak.top"
      :modal="dialogConf.modal != null ? dialogConf.modal : dialogConfBak.modal"
      :modal-append-to-body="
        dialogConf.modalAppendToBody != null
          ? dialogConf.modalAppendToBody
          : dialogConfBak.modalAppendToBody
      "
      :append-to-body="
        dialogConf.appendToBody != null
          ? dialogConf.appendToBody
          : dialogConfBak.appendToBody
      "
      :lock-scroll="
        dialogConf.lockScroll != null
          ? dialogConf.lockScroll
          : dialogConfBak.lockScroll
      "
      :custom-class="
        dialogConf.customClass != null
          ? dialogConf.customClass
          : dialogConfBak.customClass
      "
      :close-on-click-modal="
        dialogConf.closeOnClickModal != null
          ? dialogConf.closeOnClickModal
          : dialogConfBak.closeOnClickModal
      "
      :close-on-press-escape="
        dialogConf.closeOnPressEscape != null
          ? dialogConf.closeOnPressEscape
          : dialogConfBak.closeOnPressEscape
      "
      :show-close="
        dialogConf.showClose != null
          ? dialogConf.showClose
          : dialogConfBak.showClose
      "
      :before-close="
        dialogConf.beforeClose != null
          ? dialogConf.beforeClose
          : dialogConfBak.beforeClose
      "
      :center="
        dialogConf.center != null ? dialogConf.center : dialogConfBak.center
      "
      :destroy-on-close="
        dialogConf.destroyOnClose != null
          ? dialogConf.destroyOnClose
          : dialogConfBak.destroyOnClose
      "
      @open="open"
      @opened="opened"
      @close="close"
      @closed="closed"
    >
      <template v-slot:title>
        <slot name="title"></slot>
      </template>
      <slot></slot>
      <template v-slot:footer>
        <slot name="footer"></slot>
      </template>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'MyDialog',
  components: {},
  props: {
    dialogConf: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  data() {
    return {
      dialogConfBak: {}
    }
  },
  methods: {
    open(...args) {
      this.$emit('open', ...args)
    },
    opened(...args) {
      this.$emit('opened', ...args)
    },
    close(...args) {
      this.$emit('close', ...args)
    },
    closed(...args) {
      this.$emit('closed', ...args)
    }
  }
}
</script>

<style scoped></style>
